<template>
  <v-snackbar
    v-model="modelValue"
    :color="color"
    :timeout="timeout"
    :location="location"
  >
    {{ text }}
    <template v-slot:actions>
      <v-btn
        v-for="(action, index) in actions"
        :key="index"
        :color="action.color"
        variant="text"
        @click="action.onClick"
      >
        {{ action.text }}
      </v-btn>
    </template>
  </v-snackbar>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { useSnackbar } from '@/composables/useSnackbar'

const modelValue = ref(false)
const text = ref('')
const color = ref('primary')
const timeout = ref(3000)
const location = ref('top')
const actions = ref<Array<{
  text: string
  color?: string
  onClick?: () => void
}>>([])

const { snackbarRef } = useSnackbar()

onMounted(() => {
  if (snackbarRef.value) {
    snackbarRef.value = {
      modelValue,
      text,
      color,
      timeout,
      location,
      actions
    }
  }
})
</script> 